import Notification from './notification.vue';
import { newInstance } from './notification'
import noticess from "./notice.vue"
import Vue, { CreateElement, VNode } from 'vue';

import { IconType, NoticeConfig, NoticeGlobalConfig, Noticeinfo } from "./noticeConfig"

const prefixCls = 'ivu-message';
const iconPrefixCls = 'ivu-icon';
const prefixKey = 'ivu_message_key_';

const defaults = {
  top: 24,
  duration: 2
};

let messageInstance: any;
let name = 1;

const iconTypes: IconType = {
  'info': 'ios-information-circle',
  'success': 'ios-checkmark-circle',
  'warning': 'ios-alert',
  'error': 'ios-close-circle',
  'loading': 'ios-loading'
};

function getMessageInstance() {
  messageInstance = messageInstance || newInstance({
    prefixCls: prefixCls,
    styles: {
      top: `${defaults.top}px`
    }
  });

  return messageInstance;
}

function notice(type: string, options: Noticeinfo) {

  // content = '', duration = defaults.duration, type, onClose = function () { }, closable = false, render = function () { }, background = false
  const iconType = iconTypes[type];

  // if loading
  const loadCls = type === 'loading' ? ' ivu-load-loop' : '';

  const instance = getMessageInstance();

  instance.createNotice({

    name: `${prefixKey}${name}`,
    duration: options.duration ?? defaults.duration,
    styles: {},
    transitionName: 'move-up',
    content: `
            <div class="${prefixCls}-custom-content ${prefixCls}-${type}">
                <i class="${iconPrefixCls} ${iconPrefixCls}-${iconType} ${loadCls}"></i>
                <span>${options.content}</span>
            </div>
        `,
    render: options.render,
    onClose: options.onClose,
    closable: options.closable,
    type: 'message',
    msgType: type,
    background: options.background || true
  });

  // 用于手动消除
  return (function () {
    const target = name++;

    return function () {
      instance.removeNotice(`${prefixKey}${target}`);
    };
  })();
}

export default {
  name: 'Message',

  info(options: Noticeinfo | string) {
    return this.message('info', options);
  },
  success(options: Noticeinfo | string) {
    return this.message('success', options);
  },
  warning(options: Noticeinfo | string) {
    return this.message('warning', options);
  },
  error(options: Noticeinfo | string) {
    return this.message('error', options);
  },
  loading(options: Noticeinfo | string) {
    return this.message('loading', options);
  },
  message(type: string, options: Noticeinfo | string) {
    if (typeof options === 'string') {
      options = {
        content: options
      };
    }
    //options.content, options.duration, type, options.onClose, options.closable, options.render, options.background
    return notice(type, options);
  },
  config(options: NoticeGlobalConfig) {
    if (options.top || options.top === 0) {
      defaults.top = options.top;
    }
    if (options.duration || options.duration === 0) {
      defaults.duration = options.duration;
    }
  },
  destroy() {
    const instance = getMessageInstance();
    messageInstance = null;
    instance.destroy('ivu-message');
  }
};
